<template>
	<view>
		<view style="width: 750rpx;height: 20rpx;background-color: #F5F5F8;"></view>
		<view style="width: 750rpx;height: 132rpx;border-bottom: 1rpx dashed #DDDDDD;">
			<view style="font-size: 32rpx;line-height: 32rpx;margin-left: 40rpx;padding-top: 20rpx;color: #666666;">巡查时间：{{time}}</view>
			<view style="margin-top: 20rpx;">
				<text style="font-size: 32rpx;line-height: 32rpx;margin-left: 40rpx;color: #666666;" space="emsp">巡查人：{{userName}}  共{{count}}处隐患</text>
			</view>
		</view>
		<view v-for="(items,index) in list" :key="index">
			<view style="font-size: 36rpx;line-height: 36rpx;margin-top: 40rpx;margin-left: 40rpx;font-weight: 500;">{{index+1}}.{{items.name}}</view>
			<view v-for="(i,index) in items.item" :key="index">
				<view style="display: flex;">
					<image src="../../static/btn_normal@3x.png" style="width: 48rpx;height: 48rpx;margin-top: 40rpx;margin-left: 40rpx;" v-if="index!=items.index"></image>
					<image src="../../static/icon_cant@3x.png" style="width: 48rpx;height: 48rpx;margin-top: 40rpx;margin-left: 40rpx;" v-else-if="index==items.index && items.state==1" ></image>
					<image src="../../static/icon_can@3x.png" style="width: 48rpx;height: 48rpx;margin-top: 40rpx;margin-left: 40rpx;" v-else-if="index==items.index && items.state==2"></image>
					<view style="font-size: 36rpx;line-height: 36rpx;margin-left: 26rpx;margin-top: 46rpx;font-weight: 300;">{{i}}</view>
				</view>
				
				<!-- <view style="display: flex;">
					<image src="../../static/icon_勾选不可编辑状态@3x.png" style="width: 48rpx;height: 48rpx;margin-top: 40rpx;margin-left: 40rpx;"></image>
					<view style="font-size: 36rpx;line-height: 36rpx;margin-left: 26rpx;margin-top: 46rpx;font-weight: 300;">集体土地</view>
				</view>
				<view style="display: flex;">
					<image src="../../static/icon_隐患选项@3x.png" style="width: 48rpx;height: 48rpx;margin-top: 40rpx;margin-left: 40rpx;"></image>
					<view style="font-size: 36rpx;line-height: 36rpx;margin-left: 26rpx;margin-top: 46rpx;font-weight: 300;">私有土地</view>
				</view> -->
			</view>
			<view v-if="items.images" style="display: flex;flex-wrap: wrap;padding: 0 20rpx 0 20rpx;box-sizing: border-box;" >
				<view v-for="(e,imageIndex) in items.images" :key="e">
					<image :src="e" style="width: 200rpx;height: 200rpx;margin-left: 20rpx;margin-top: 20rpx;" @click="openImg(items,imageIndex)"></image>
				</view>	
			</view>
			<view v-if="items.type===3">
				<textarea v-model="items.remark" disabled=true style="margin-left: 36rpx;border: 1rpx solid #d6e4ef;margin-top: 20rpx;padding: 18rpx;font-size: 32rpx;border-radius: 8rpx;line-height: 1.5;"/>
			</view>
			<view style="margin-top: 76rpx;width: 750rpx;height: 1rpx;background-color: #E5E5E5;"></view>
			
		</view>
		<view>
			<image src="../../static/share_btn@3x.png"style="width: 154rpx;height: 154rpx;position: fixed;bottom: 40rpx;right: 20rpx;" @click="download()"></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				list:[],
				time:'',
				count:'',
				userName:''
				
			}
		},
		methods: {
			download(){
				uni.showLoading({
					 title: '加载中'
				});
				this.$myRequest({
					url:'/project_flood/v1/check/anwser/flood/pdf/'+this.id,
				}).then((res)=>{
					console.log(res);
					uni.downloadFile({
				    url: res.data.data.url, 
				    success: response => {
				        if (response.statusCode === 200) {
				          uni.saveFile({
				            tempFilePath: response.tempFilePath,
				            success: (resData) => {
				              uni.openDocument({
				                filePath: resData.savedFilePath,
				                fileType: 'pdf', // 指定文件的格式
				                showMenu: true, // 允许出现分享功能
				                success: r => {
				                  console.log(r)
								  uni.hideLoading();
				                },
				                fail: openError => {
				                  console.log('打开失败: ', openError)
				                }
				              })
				            },
				            fail: error => {
				              console.log('error: ', error)
				            }
				          })
				        }
				      }
				});
				})
				
			},
			async getMes(){
				this.$myRequest({
					url:`/project_flood/v1/check/anwser/flood/detail/`+this.id
				}).then((res)=>{
					console.log(res);
					this.list=res.data.data.question
					this.time=res.data.data.createTime
					this.count=res.data.data.count
					this.userName=res.data.data.userName
				})
			},
			openImg(items,index){
				const images = items.images
				// console.log(e);
				// let imgsArray = [];
				// imgsArray[0] = e
				console.log(images,index);
				uni.previewImage({
				current: index,
				urls: images
				});
			},
		},
		onLoad(options) {
			this.id=options.id
			this.getMes()
		}
	}
</script>

<style>

</style>
